<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>订单管理</title>
<link rel="stylesheet" th:href="@{/css/goods_trade/goods_trade.css}">
<style type="text/css">
	input[type=file] {
		display: none;
	}
</style>
</head>
<body>
	<div id="inorderPageDiv">
	
		<div>
	    	<el-breadcrumb separator-class="el-icon-arrow-right">
			  <el-breadcrumb-item>订单管理</el-breadcrumb-item>
			  <el-breadcrumb-item>入库管理</el-breadcrumb-item>
			</el-breadcrumb>
			<button id="welcome_to_jk" hidden="hidden"></button>
		</div>
		<br/>
		
		<!-- content start -->
			<el-form :inline="true" :model="orderVo" class="demo-form-inline">
			  <el-form-item label="目的仓库地址">
			    <el-select v-model="orderVo.toWhereHouse" placeholder="目的仓库地址" @change="selectQueryPositionByHouse">
			      <el-option v-for="ho in house" :label="ho.houseName" :value="ho.id" :key="ho.id"></el-option>
			    </el-select>
			  </el-form-item>
			  <el-form-item label="目的库位地址">
			    <el-select v-model="orderVo.toWherePosition" placeholder="目的库位地址">
			      <el-option v-for="po in position" :label="po.positionName" :value="po.id" :key="po.id"></el-option>
			    </el-select>
			  </el-form-item>
			  <el-form-item label="目的货位">
			    <el-select v-model="orderVo.toWhereLocation" placeholder="目的货位">
			      <el-option v-for="lo in location" :label="lo.locationName" :value="lo.id" :key="lo.id"></el-option>
			    </el-select>
			  </el-form-item>
			  <el-form-item label="入库单号">
			       <el-input v-model="orderVo.inorderNum" placeholder="入库单号"></el-input>
			  </el-form-item>
			  <el-form-item label="商品名称">
			       <el-input v-model="orderVo.goodsName" placeholder="商品名称"></el-input>
			  </el-form-item>
			  <el-form-item label="商品编号">
			      <el-input v-model="orderVo.sku" placeholder="商品编号"></el-input>
			  </el-form-item>
			  <br>
			  <div class="submitBtn">
			    <el-button type="primary" @click="onQueryForBtn" :loading="queryBtn">查询</el-button>
			    <el-button type="primary" @click="dialogFormVisible = true" >新建订单</el-button>
			    <el-dialog title="订单录入" :visible.sync="dialogFormVisible">
				  <el-form :model="createInorderForm" ref="createInorderForm" :rules="orderRules" :label-position="labelPosition" :label-width="formLabelWidth">
				  	 <el-form-item prop="toWhereHouse" label="选择仓库位置" >
					    <el-select v-model="createInorderForm.toWhereHouse" placeholder="目的仓库地址" @change="selectOrderHouseForQuery">
					      <el-option v-for="ho in house" :label="ho.houseName" :value="ho.id" :key="ho.id"></el-option>
					    </el-select>
				    </el-form-item>
				    <el-form-item prop="toWherePosition" label="选择库位位置" >
				      <el-select v-model="createInorderForm.toWherePosition" placeholder="目的库位地址" @change="selectOrderPositionForQuery">
					      <el-option v-for="po in position" :label="po.positionName" :value="po.id" :key="po.id"></el-option>
					    </el-select>
				    </el-form-item>
				    <el-form-item prop="toWhereLocation" label="选择货位位置" >
				      	<el-select v-model="createInorderForm.toWhereLocation" placeholder="目的货位"  @change="selectOrderLocationForQuery">
				      		<el-option v-for="lo in location" :label="lo.locationName" :value="lo.id" :key="lo.id"></el-option>
				    	</el-select>
				    </el-form-item>
				    <el-form-item prop="goodsName" label="商品名称" >
				      <el-input v-model="createInorderForm.goodsName" auto-complete="off"></el-input>
				    </el-form-item>
				    <el-form-item prop="goodsSku" label="商品编码" >
				      <el-input v-model="createInorderForm.goodsSku" auto-complete="off"></el-input>
				    </el-form-item>
				    <el-form-item prop="goodsDesc" label="商品描述" >
				      <el-input v-model="createInorderForm.goodsDesc" auto-complete="off"></el-input>
				    </el-form-item>
				    <el-form-item prop="goodsNum" label="商品数量" >
				      <el-input v-model.number="createInorderForm.goodsNum" auto-complete="off" type="number"></el-input>
				    </el-form-item>
				    <el-form-item prop="goodsPrice" label="商品单价" >
				      <el-input v-model.number="createInorderForm.goodsPrice" auto-complete="off" type="number"></el-input>
				    </el-form-item>
				    <el-form-item prop="goodsUnit" label="商品单位" >
				      <el-input v-model="createInorderForm.goodsUnit" auto-complete="off"></el-input>
				    </el-form-item>
				    <el-form-item prop="goodsProduceDate" label="商品生产日期" >
				      <el-date-picker
					      v-model="createInorderForm.goodsProduceDate"
					      type="datetime"
					      placeholder="选择日期时间">
					    </el-date-picker>
				    </el-form-item>
				    <el-form-item prop="goodsPeriod" label="商品保质期" >
				      <el-input v-model="createInorderForm.goodsPeriod" auto-complete="off"></el-input>
				    </el-form-item>
				    <el-form-item prop="supplierName" label="商品供应商" >
				      <el-input v-model="createInorderForm.supplierName" auto-complete="off"></el-input>
				    </el-form-item>
				  </el-form>
				  
				  <div slot="footer" class="dialog-footer">
				    <el-button @click="restDialogForm('createInorderForm')">取 消</el-button>
				    <el-button type="primary" @click="submitFomr('createInorderForm')">确 定</el-button>
				  </div>
				</el-dialog>
			    <el-button type="primary" @click="batUploadFormVisible = true" >新建批量物资订单</el-button>
			    <el-dialog title="新建批量物资订单" :visible.sync="batUploadFormVisible">
				    <el-upload
					  class="upload-demo"
					  ref="upload"
					  :action="uploadUrl"
					  :on-success="uploadSuccess"
					  :before-upload="beforeUpload"
					  :auto-upload="true"
					  :file-list="fileList"
					  :limit='1'>
					  <el-button size="small" type="primary">点击上传</el-button>
					  <div slot="tip" class="el-upload__tip">只能上传excel文件，且不超过10M</div>
					  <div slot="tip"><a href="../uploadControlle/getExcelModel">点击此处下载数据模板<span style="color:red;">（请按照此模板造数据）</span></a></div>
					</el-upload>
				</el-dialog>
			  </div>
			</el-form>
		<!-- content end -->
			<el-tag style="width:100%;">详情表格</el-tag>
		<!-- table start -->
			<template>
			  <el-table
			    :data="inorderDetail"
			    style="width: 100%">
			    <el-table-column
			      label="入库单号"
			      prop="inorderNum">
			    </el-table-column>
			    <el-table-column
			      label="入库目的地"
			      prop="toWhereHouseName">
			    </el-table-column>
			    <el-table-column
			      label="入库目的库位"
			      prop="toWherePositionName">
			    </el-table-column>
			    <el-table-column
			      label="入库目的货位"
			      prop="toWhereLocationName">
			    </el-table-column>
			    <el-table-column
			      label="状态"
			      :formatter="statusFormat"
			      prop="status">
			    </el-table-column>
			    <el-table-column
			      label="创建时间"
			      :formatter="dateFormat"
			      prop="createDate">
			    </el-table-column>
			    <el-table-column
			      label="创建用户"
			      prop="creatorName">
			    </el-table-column>
			    <el-table-column
			      label="更新时间"
			      :formatter="dateFormat"
			      prop="updateDate">
			    </el-table-column>
			    <el-table-column
			      label="更新用户"
			      prop="updatorName">
			    </el-table-column>
			    
			    <el-table-column
				      fixed="right"
				      label="操作"
				      width="100">
				      <template slot-scope="scope">
				      	<!-- 弹窗 --> 
						<el-popover  ref="popover" placement="left" width="900" trigger="click" class="demo-input-suffix">
						<el-table :data="inorderGoodsData">
						    <el-table-column property="goodsName" label="商品名称"></el-table-column>
						    <el-table-column property="goodsDesc" label="商品描述"></el-table-column>
						    <el-table-column property="goodsSku" label="商品编码"></el-table-column>
						    <el-table-column property="goodsNum" label="商品数量"></el-table-column>
						    <el-table-column property="goodsUnit" label="商品单位"></el-table-column>
						    <el-table-column property="goodsPrice" label="商品价格"></el-table-column>
						  </el-table>
		  				<span class="dialog-footer">
							    <el-button size="mini" type="primary" @click="closePopper">关闭</el-button>
							</span>
						</el-popover> 
				      	<el-button v-popover:popover size="mini"  type="primary" circle @click="seeGoodsDetail(scope.row)">查看物资</el-button>
				      </template>
				    </el-table-column>
			    
			  </el-table>
			</template>		
			
			<div class="pageContent">		
				<el-pagination
			      @size-change="handleSizeChange"
			      @current-change="handleCurrentChange"
			      :current-page="currentPage"
			      :page-sizes="[5, 10]"
			      :page-size="pageSize"
			      layout="total, sizes, prev, pager, next, jumper"
			      :total="totalSize">
			    </el-pagination>
			</div>
		<!-- table end -->
	</div>
</body>
<script type="text/javascript" th:src="@{js/order/inorder.js}"></script>
</html>